<template>
  <el-table
      :data="data"
      :empty-text="emptyText"
      v-loading="loading"
      element-loading-text="正在加载"
      element-loading-spinner="el-icon-loading"
  >
    <el-table-column type="index" label="#"></el-table-column>
    <el-table-column v-if="containDataItem('taskname')" prop="taskname" label="任务名称"></el-table-column>
    <el-table-column v-if="containDataItem('taskName')" prop="taskName" label="任务名称"></el-table-column>
    <el-table-column v-if="containDataItem('userId')" prop="userId" label="邀请者ID"></el-table-column>
    <el-table-column v-if="containDataItem('username')" prop="username" label="发布者"></el-table-column>
    <el-table-column v-if="containDataItem('type')" prop="type" label="测试类型"></el-table-column>
    <el-table-column v-if="containDataItem('deviceRequirement')" label="测试环境" width="200">
      <template v-slot="{row}">
        <test-environment :device-requirement="row.deviceRequirement" :capable-to-claim="row.capableToClaim"></test-environment>
      </template>
    </el-table-column>
    <el-table-column v-if="containDataItem('reportPrice')" prop="reportPrice" label="报告单价"></el-table-column>
    <el-table-column v-if="containDataItem('need_num')" prop="need_num" label="需求情况"></el-table-column>
    <el-table-column v-if="containDataItem('deadline')" prop="deadline" label="截止日期"></el-table-column>
    <el-table-column v-if="containDataItem('needNumber')" prop="needNumber" label="需求情况"></el-table-column>
    <el-table-column v-if="containDataItem('endTime')" prop="endTime" label="截止日期"></el-table-column>
    <el-table-column label="操作" width="130px">
      <template v-slot="scope">
          <slot :task="scope.row" name="option"></slot>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import TestEnvironment from "@/components/new/test-environment/TestEnvironment";
export default {
  name: "TaskInfoList",
  components: {TestEnvironment},
  props: {
    data: [],
    loading: {
      default: false
    },
    dataItems: [],
    emptyText: ''
  },
  methods: {
    containDataItem(item){
      return this.dataItems.indexOf(item) !== -1;
    }
  }
}
</script>

<style scoped>

</style>
